<!DOCTYPE html>
<html lang="zh-cn">

	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
		<link rel="stylesheet" type="text/css" href="css/base.css">
		<title>首页|IT修真院</title>
	</head>

	<body>
		<header>
			<div class="loginbar-wrap">
				<div class="container">
					<div class="loginbar">
						<div class="loginbar-PC">
							<span class="loginbar-tel"> 客服热线：010-594-9832 </span>
							<ul class="loginbar-login">
								<li>
									<a href="#"><img src="img/WeChat.png" /></a>
								</li>
								<li>
									<a href="#"><img src="img/QQ.png" /></a>
								</li>
								<li>
									<a href="#"><img src="img/MicroBlog.png" /></a>
								</li>
							</ul>
						</div>
						<div class="loginbar-mobile">
							<ul class="loginbar-login">
								<li>
									<a href="#">登陆</a>
								</li>
								<li>
									<a href="#">注册</a>
								</li>
							</ul>
						</div>

					</div>
				</div>
			</div>
			<div class="navbar-wrap">
				<div class="container">
					<nav class="navbar">
						<div class="navbar-brand">
							<a class="logo" href="#"><img src="img/logo.png" /></a>
						</div>
						<!--移动端导航-->
						<div class="nav-mobile">
							<button class="navbar-toggle">
				      			<span class="icon-bar"></span>
				      			<span class="icon-bar"></span>
				      			<span class="icon-bar"></span>  			
				      		</button>

							<ul class="nav navbar-nav">
								<li class="active">
									<a href="index.html">首页</a>
								</li>
								<li>
									<a href="partner-page.html">推荐</a>
								</li>
								<li>
									<a href="job-page.html">职业</a>
								</li>
								<li>
									<a href="#">关于</a>
								</li>

							</ul>
						</div>
						<!--PC端导航-->
						<div class="nav-PC">
							<ul class="nav navbar-nav">
								<li class="active">
									<a href="index.html">首页</a>
								</li>
								<li>
									<a href="partner-page.html">推荐</a>
								</li>
								<li>
									<a href="job-page.html">职业</a>
								</li>
								<li>
									<a href="#">关于</a>
								</li>

							</ul>
						</div>
					</nav>
				</div>
			</div>

		</header>
		<div class="carousel">
			<ol class="carousel-indicators">
				<li class="indicator" id="indicator1"></li>
				<li class="indicator" id="indicator2"></li>
				<li class="indicator" id="indicator3"></li>

			</ol>
			<div id="carousel-inner" class="carousel-inner">
				<div class="item">
					<img src="img/banner1.jpg" />

				</div>
				<div class="item">
					<img src="img/banner2.jpg" />

				</div>
				<div class="item">
					<img src="img/banner3.jpg" />
				</div>

			</div>
			<a class="carousel-control left" href="#"><img src="img/icon-pre.png" /></a>
			<a class="carousel-control right" href="#"><img src="img/icon-next.png" /></a>

		</div>
		<div class="home-main">
			<div class="container margin-top-bottom-30">
				<div class="percent25 percent25-reset">
					<div class="home-tag">
						<div class="icon-tag"><img src="img/enfficent.png" /></div>
						<h4>高效</h4>
						<p>将五到七年的成长时间，缩短到一到三年</p>

					</div>
				</div>
				<div class="percent25 percent25-reset">
					<div class="home-tag">
						<!--此处图片会导致布局问题-->
						<div class="icon-tag"><img src="img/standard.png" /></div>
						<h4>规范</h4>
						<p>将五到七年的成长时间，缩短到一到三年</p>

					</div>
				</div>
				<div class="percent25 percent25-reset">
					<div class="home-tag">
						<div class="icon-tag"><img src="img/inter.png" /></div>
						<h4>人脉</h4>
						<p>将五到七年的成长时间，缩短到一到三年</p>

					</div>
				</div>
				<div class="percent25 percent25-reset">
					<div class="home-tag home-tag-no">
						<img src="img/number.png">
							<span class="date-binding">12400</span>
							<p class="muted">
								累计在线学习人数
							</p>
							<img src="img/number.png">
							<span class="date-binding">10320</span>
							<p class="muted">
								学员已找到满意工作
							</p>

					</div>
							

				</div>
			</div>
			<div class="container margin-top-bottom-30">
				<h3>如何学习</h3>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							1
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							2
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							3
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							4
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<!--<img src="img/step-next-icon.png" />-->
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							5
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							6
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							7
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<img src="img/step-next-icon.png" />
						</div>

					</div>
				</div>
				<div class="percent25">
					<div class="learn-step-item">
						<div class="step-no">
							8
						</div>
						<div class="step-detail">
							<p>匹配你的个人情况，寻找适合你的岗位</p>
						</div>
						<div class="step-next-icon">
							<!--<img src="img/step-next-icon.png" />-->
						</div>

					</div>
				</div>
			</div>
			<div class="container margin-top-bottom-30">
				<h3>优秀学员展示</h3>
				<div class="percent25">
					<div class="stu-card ">
						<div class="stu-thumbnail">
							<img src="img/stu-1.png" />
						</div>
						<h4>技术顾问：罗大佑</h4>
						<p>百度技术总监：互联网基础服务领域，从事虚拟机，云服务器，域名。曾任新网高级技术经理，负责技术研发、团队建设和管理。</p>
					</div>
				</div>
				<div class="percent25">
					<div class="stu-card ">
						<div class="stu-thumbnail first">
							<img src="img/stu-1.png" />
						</div>
						<h4>技术顾问：罗大佑</h4>
						<p>百度技术总监：互联网基础服务领域，从事虚拟机，云服务器，域名。曾任新网高级技术经理，负责技术研发、团队建设和管理。</p>
					</div>
				</div>
				<div class="percent25">
					<div class="stu-card ">
						<div class="stu-thumbnail">
							<img src="img/stu-1.png" />
						</div>
						<h4>技术顾问：罗大佑</h4>
						<p>百度技术总监：互联网基础服务领域，从事虚拟机，云服务器，域名。曾任新网高级技术经理，负责技术研发、团队建设和管理。</p>
					</div>
				</div>
				<div class="percent25">
					<div class="stu-card ">
						<div class="stu-thumbnail">
							<img src="img/stu-1.png" />
						</div>
						<h4>技术顾问：罗大佑</h4>
						<p>百度技术总监：互联网基础服务领域，从事虚拟机，云服务器，域名。曾任新网高级技术经理，负责技术研发、团队建设和管理。</p>
					</div>
				</div>

			</div>
			<div class="container margin-top-bottom-30">
				<h3>战略合作企业</h3>
				<div class="percent20">
					<div class="partner">
						<img src="img/ALiBaBa.png" />
					</div>
				</div>
				<div class="percent20">
					<div class="partner">
						<img src="img/kingsoft.png" />
					</div>
				</div>
				<div class="percent20">
					<div class="partner">
						<img src="img/huanxin.png" />
					</div>
				</div>
				<div class="percent20">
					<div class="partner">
						<img src="img/ronglian.png" />
					</div>
				</div>
				<div class="percent20">
					<div class="partner">
						<img src="img/qiniu.png" />
					</div>
				</div>

			</div>
			<div class="friendLinks-wrap">
				<div class="container">
					<h3>友情链接</h3>
					<ul class="friendLinks">
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>教师招聘</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>手机软件</a>
						</li>
						<li>
							<a href="#"><i class="dot"></i>找工作</a>
						</li>
					</ul>
				</div>

			</div>

		</div>
		<footer class="footer">

			<div class="footer-top">
				<div class="container">
					<div class="percent40 left">
						<p class="headline">技能树——变你我</p>
						<p class="null"></p>
						<p>
							<a href="">关于我们</a>&nbsp;|&nbsp;
							<a href="">联系我们</a>&nbsp;|&nbsp;
							<a href="">合作企业</a>
						</p>
					</div>
					<div class="percent40 center">
						<p class="headline">旗下网站</p>
						<p>
							<a href="#">草船云孵化器</a>
							<a href="#">最强IT特训营</a>
						</p>
						<p>
							<a href="#">葡萄藤轻游戏</a>
							<a href="#">桌游精灵</a>
						</p>
					</div>
					<div class="percent20 percent20-reset right">
						<p class="headline">微信公众平台
						</p>
						<div><img src="img/QRcode.png" /></div>
					</div>
				</div>

			</div>
			<div class="footer-bottom">
				<div class="copyright container">
					Copyright&nbsp;©2015技能树&nbsp;www.jnshu.com&nbsp;All&nbsp;Rights&nbsp;Reserved|京ICP备13005880号
				</div>

			</div>

		</footer>
	</body>

</html>